<template>
  <div>
    <van-tree-select
  v-model:main-active-index="activeIndex"
  height="100vw"
  :items="item.items"
>
  <template #content>
  <div  v-if="activeIndex === 0">
<van-grid square icon-size="30px">
  <van-grid-item v-for="item in service.allservice" :key="item" :icon="'http://124.93.196.45:8087/prod-api/'+item.applicationLogo" :text="item.applicationLabel" />
</van-grid>
  </div>
    <!-- <van-image
      v-if="activeIndex === 1"
      src="https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg"
    /> -->
  </template>
</van-tree-select>
   
  </div>

</template>

<script setup>
import { reactive,ref,onMounted } from "vue"
import { allService,fenleiApp } from "../model/banner"
// 全部服务
let service = reactive({
  allservice:{}
})
const activeIndex = ref(0)
let item = reactive({items: [{ text: '分组 1' }, { text: '分组 2' }]})

onMounted(() => {
    allService({},{
       Authorization:window.localStorage.getItem("token")
    }).then(res => {
      service.allservice = res.data.rows
      console.log(res);
    })

    fenleiApp({},{
       Authorization:window.localStorage.getItem("token")
    }).then(res => {
      console.log(res);
  let ress = res.data.rows.map(item=>{
    return{
      text: item.applicationCenterCatalogue
    }
  })
  item.items = ress

      console.log(ress);
    })
})


</script>

<style lang="scss" scoped>
.van-grid-item--square {
    height: 120px;
    width: 70px;
}
</style>